<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>图书管理系统</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <!-- 引入基础CSS样式 -->
    <link href="/assets/css/dpl-min.css" rel="stylesheet" type="text/css" />
    <!-- 引入BUI（Baidu UI）框架的CSS -->
    <link href="/assets/css/bui-min.css" rel="stylesheet" type="text/css" />
    <!-- 引入自定义的主要CSS样式 -->
    <link href="/assets/css/main-min.css" rel="stylesheet" type="text/css" />
</head>
<body>
<!-- 页眉部分，包含logo、系统名称及用户登录信息 -->
<div class="header">
    <div class="dl-title">
        <!-- 显示系统Logo -->
        <img src="/assets/img/logo.png" style="height: 30px;">
        图书管理系统
        <span>Library Management System</span>
    </div>
    <div class="dl-log">
        <!-- 动态显示用户名，数据来自Thymeleaf表达式 -->
        欢迎您：<span class="dl-log-user" th:text="${session.user.username}"></span>
        <!-- 提供退出系统的链接 -->
        <a href="/user/logout" title="退出系统" class="dl-log-quit">[退出]</a>
    </div>
</div>
<!-- 主体内容区 -->
<div class="content">
    <!-- 导航栏 -->
    <div class="dl-main-nav">
        <!-- 通知栏组件 -->
        <div class="dl-inform"><div class="dl-inform-title"><s class="dl-inform-icon dl-up"></s></div></div>
        <!-- 导航菜单项 -->
        <ul id="J_Nav"  class="nav-list ks-clear">
            <!-- 当前选中的导航项 -->
            <li class="nav-item dl-selected"><div class="nav-item-inner nav-home">系统管理</div></li>		<!-- <li class="nav-item dl-selected"><div class="nav-item-inner nav-order">业务管理</div></li> -->

        </ul>
    </div>
    <!-- 内容容器，通常由JavaScript动态填充 -->
    <ul id="J_NavContent" class="dl-tab-conten">
        <!-- 内容将在这里通过Ajax或JavaScript动态加载 -->
    </ul>
</div>
<!-- 页脚部分 -->
<div class="footer">
    10086版权所有
</div>
<!-- 引入必要的JavaScript库 -->
<script type="text/javascript" src="/assets/js/jquery-1.8.1.min.js"></script>
<script type="text/javascript" src="/assets/js/bui-min.js"></script>
<script type="text/javascript" src="/assets/js/common/main-min.js"></script>
<script type="text/javascript" src="/assets/js/config-min.js"></script>
<!-- 初始化页面功能 -->
<script>
    // 使用BUI框架初始化页面模块
    BUI.use('common/main',function(){
        var config = [{id:'1',menu:[{text:'书籍管理',items:[
                    {id:'12',text:'书籍查询',href:'/book/list/1'},
                    {id:'3',text:'书籍借阅',href:'/borrow/list'},
                    {id:'4',text:'书籍归还',href:'/back/list'}
                ]}]}];
        // 实例化主页面对象，传入配置
        new PageUtil.MainPage({
            modulesConfig : config
        });
    });
</script>
</body>
</html>